﻿<%@page import="com.zaofan.constant.LableConstant"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@page import="java.util.List"%>
<%@page import="com.zaofan.bean.Lable"%>
<%@page import="com.zaofan.cache.CacheManage"%>
<%@page import="com.zaofan.bean.Admin"%>
<%@page import="com.zaofan.bean.AdminType"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<%
	String contextPath = request.getContextPath();
Admin admin = (Admin)session.getAttribute("admin");
if(admin == null){
	response.sendRedirect(contextPath + "/login.jsp?state=" + "session-invalid");
	return;
	}
if(admin.getType() != AdminType.admin.ordinal() &&  admin.getType() != 4){
	response.sendRedirect(contextPath + "/login.jsp?state=" + "session-invalid");
	return;
}
%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>时间管理</title>
<link href="<%=contextPath%>/admin/css/base.css" rel="stylesheet" />
<link href="<%=contextPath%>/admin/assets/css/bootstrap.min.css"
	rel="stylesheet" />
<link rel="stylesheet"
	href="<%=contextPath%>/admin/assets/css/font-awesome.min.css" />
<!--[if IE 7]>
	<link rel="stylesheet" href="<%=contextPath%>/admin/assets/css/font-awesome-ie7.min.css" />
<![endif]-->
<link rel="stylesheet"
	href="<%=contextPath%>/admin/assets/css/ace.min.css" />
<link rel="stylesheet"
	href="<%=contextPath%>/admin/assets/css/ace-rtl.min.css" />
<link rel="stylesheet"
	href="<%=contextPath%>/admin/assets/css/ace-skins.min.css" />
<!--[if lte IE 8]>
	<link rel="stylesheet" href="<%=contextPath%>/admin/assets/css/ace-ie.min.css" />
<![endif]-->
<script src="<%=contextPath%>/admin/assets/js/ace-extra.min.js"></script>
<!--[if lt IE 9]>
	<script src="<%=contextPath%>/admin/assets/js/html5shiv.js"></script>
	<script src="<%=contextPath%>/admin/assets/js/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet"
	href="<%=contextPath%>/admin/assets/css/jquery-ui-1.10.3.custom.min.css" />
<link rel="stylesheet"
	href="<%=contextPath%>/admin/assets/css/daterangepicker.css" />
<link rel="stylesheet"
	href="<%=contextPath%>/admin/assets/css/chosen.css" />
<script type="text/javascript">  
       var contextPath='<%=contextPath%>';
</script>
</head>
<body style="background-color: #fff;">
	<div class="breadcrumbs" id="breadcrumbs">
		<script type="text/javascript">
			try {
				ace.settings.check('breadcrumbs', 'fixed')
			} catch (e) {
			}
		</script>
		<ul class="breadcrumb" style="padding: 20px; color: #3a87ad;">
		</ul>
	</div>
	<div class="page-content">
		<div class="row" style="height: 100%">
			<div class="col-xs-12">

				<button type="button" class="btn btn-primary" id="addAd">增加</button>
				<style>
                .table-responsive table th tr {
                    text-align: center;
                }
                </style>
				<div class="table-responsive">
					<input type="hidden" value="1" id="start" />
					<table id="sample-table-2"
						class="table table-striped table-bordered table-hover">
						<thead>
							<tr>
								<th style="text-align: center;">城市</th>
								<th style="text-align: center;">分类名</th>
								<th style="text-align: center;">排序</th>
								<th style="text-align: center;">打烊时间</th>
								<th style="text-align: center;">首页图片</th>
                                <th style="text-align: center;">二级页面图片</th>
                                <th style="text-align: center;">新版首页图片</th>
								<th style="text-align: center;">类型</th>
                                <th style="text-align: center;">状态</th>

								<th style="text-align: center;">操作</th>
							</tr>
						</thead>
						<tbody id="data-list" style="text-align: center;">
						</tbody>
					</table>
				</div>
			</div>
			<!-- /.col -->
		</div>
		<!-- /.row -->
		<div class="row">
			<div class="col-sm-6">
				<div id="sample-table-2_info" class="dataTables_info">
					当前 <span id="current"> </span> 到 <span id="page"></span> 总共 <span
						id="total"></span> 条
				</div>
			</div>
			<div class="col-sm-6">
				<div class="dataTables_paginate paging_bootstrap">
					<ul class="pagination pagination-sm" id="page-list">
					</ul>
				</div>
			</div>
		</div>
	</div>
	<div id="loading"
		style="width: 32px; height: 32px; position: fixed; left: 40%; top: 40%; display: none;">
		<img src="<%=contextPath%>/admin/assets/css/images/loading.gif"
			width="32" height="32" />
	</div>
	<div class="popover"
		style="z-index: 9999; width: 150px; position: fixed; left: 40%; top: 40%;">
		<div class="arrow"></div>
		<div class="popover-inner">
			<h3 class="popover-title">操作提示</h3>
			<div class="popover-content" id="popover-content">
				<p>操作成功</p>
			</div>
		</div>
	</div>
	<%
				List<Lable> lables = CacheManage.lables.get(LableConstant.lable_activity_type_lable);
				application.setAttribute("activityType", lables);
				application.setAttribute("activityScope", CacheManage.lables.get(LableConstant.lable_activity_scope_lable));
				application.setAttribute("ranks", CacheManage.ranks);
			%>
	<div id="acEditBox"
		style="display: none; z-index: 99; width: 600px; position: fixed; left: 20%; top: 0%; border: 1px solid #ccc; border-radius: 4px !important;">
		<div class="arrow"></div>
		<div class="popover-inner" style="">
			<h3 class="popover-title" >分类</h3>
			<div class="popover-content"  style="background-color: #F5F5F5;">
				<form class="form-horizontal" style="padding-top: 10px;"
					method="post" id="acForm" >
					<input type="hidden" id="id" name="id" value="" />
					<input type="hidden" id="classId" name="classId" value="1" />
                    <input	type="hidden" id="action" value="" />
					<div class="form-group">

						<label  class="col-sm-2 control-label">城市：</label>
                        <%--<input type="hidden" value="" name="endDate" id="endDate" />--%>
                        <div class="col-sm-9">
                            <select id="cityId" name="cityId" class="form-control" >
                            </select>
                        </div>
                        <label  class="col-sm-2 control-label">分类名：</label>

                        <%--<input type="hidden" value="" name="endDate" id="endDate" />--%>
                        <div class="col-sm-9">
                            <input class="form-control" type="text" name="className" id="classname" />
                        </div>
						<label  class="col-sm-2 control-label">类型：</label>

						<div class="col-sm-9">
							<select id="type" name="type" class="form-control" >
								<option value="0">普通</option>
								<option value="1">逼格</option>
								<option value="2">一元购专场</option>
								<option value="3">地推专场</option>
							</select>
						</div>
                        <label  class="col-sm-2 control-label">排序：</label>
                        <%--<input type="hidden" value="" name="endDate" id="endDate" />--%>
                        <div class="col-sm-9">
                            <input class="form-control" type="text" name="classOrder" id="classOrder" />
                        </div>
                        <label  class="col-sm-2 control-label">打烊时间：</label>
                        <%--<input type="hidden" value="" name="startDate" id="startDate" />--%>
                        <%--<input type="hidden" value="" name="endDate" id="endDate" />--%>
                        <div class="col-sm-9 bootstrap-timepicker">
                            <input class="form-control" type="text" name="closetime" id="id-date-range-picker-1" />
                        </div>
                        <input type="hidden" value="" name="classImage" id="classImage" />
                        <label  class="col-sm-2 control-label">首页图片：</label>
                        <div class="col-sm-9">
                            <div id="imageClass" style="display:none;">
                                <img src="" width="50%" height="100" />
                            </div>
                            <br/>
                            <input type="file" id="cimage" />
                        </div>
                        <input type="hidden" value="" name="detailImage" id="detailImage" />
                        <label  class="col-sm-2 control-label">二级页面图片：</label>
                        <div class="col-sm-9">
                            <div id="imagedetail" style="display:none;">
                                <img src="" width="50%" height="100" />
                            </div>
                            <br/>
                            <input type="file" id="dimage" />
                        </div>
						<input type="hidden" value="" name="categoryImage" id="categoryImage" />
						<label  class="col-sm-2 control-label">新版页面图片：</label>
						<div class="col-sm-9">
							<div id="imageCategory" style="display:none;">
								<img src="" width="50%" height="100" />
							</div>
							<br/>
							<input type="file" id="caimage" />
						</div>

						<span class="input_tip" style="line-height: 30px;">*</span>
					</div>
				</form>
			</div>
			<div class="popover-footer"
				style="background-color: #F5F5F5; overflow: hidden; text-align: center;">
				<button type="button" class="btn btn-primary"
					style="padding: 0px; margin: 0px 5px 5px 0px;" id="cancel">
					<i class="icon-ok"></i>取消
				</button>
				<button type="button" class="btn btn-danger"
					style="padding: 0px; margin: 0px 5px 5px 0px;" id="save">
					<i class="icon-edit"></i>保存
				</button>
			</div>
		</div>
	</div>

	<script type="text/javascript">
		if ("ontouchend" in document)
			document
					.write("<script src='<%=contextPath%>/admin/assets/js/jquery.mobile.custom.min.js'>"
							+ "<"+"/script>");
	</script>
	<script type="text/javascript">
		window.jQuery
				|| document
						.write("<script src='<%=contextPath%>/admin/assets/js/jquery-2.0.3.min.js'>"
								+ "<"+"script>");
	</script>

	<!--[if IE]>
		<script type="text/javascript">
			window.jQuery || document.write("<script src='<%=contextPath%>/admin/assets/js/jquery-1.10.2.min.js'>"+"<"+"script>");
		</script>
	<![endif]-->
	<script type="text/javascript">
		if ("ontouchend" in document)
			document
					.write("<script src='<%=contextPath%>/admin/assets/js/jquery.mobile.custom.min.js'>"
							+ "<"+"script>");
	</script>
	<script src="<%=contextPath%>/admin/assets/js/bootstrap.min.js"></script>
	<script src="<%=contextPath%>/admin/assets/js/typeahead-bs2.min.js"></script>

	<!--[if lte IE 8]>
		  <script src="assets/js/excanvas.min.js"></script>
	<![endif]-->
	<script
		src="<%=contextPath%>/admin/assets/js/jquery-ui-1.10.3.custom.min.js"></script>
	<script
		src="<%=contextPath%>/admin/assets/js/jquery.ui.touch-punch.min.js"></script>
	<script src="<%=contextPath%>/admin/assets/js/jquery.slimscroll.min.js"></script>
	<script
		src="<%=contextPath%>/admin/assets/js/jquery.easy-pie-chart.min.js"></script>
	<script src="<%=contextPath%>/admin/assets/js/jquery.sparkline.min.js"></script>
	<script src="<%=contextPath%>/admin/assets/js/ace-elements.min.js"></script>
	<script src="<%=contextPath%>/admin/assets/js/ace.min.js"></script>
	<script src="<%=contextPath%>/admin/js/common.js"></script>
	<script src="<%=contextPath%>/admin/assets/js/jquery-form.js"></script>
	
	<script
		src="<%=contextPath%>/admin/assets/js/jquery.dataTables.bootstrap.js"></script>
	<script
		src="<%=contextPath%>/admin/assets/js/jquery.dataTables.bootstrap.js"></script>
	<script src="<%=contextPath%>/admin/assets/js/date-time/moment.min.js"></script>
	<script	src="<%=contextPath%>/admin/assets/js/date-time/daterangepicker.min.js"></script>
	<script	src="<%=contextPath%>/admin/assets/js/date-time/bootstrap-timepicker.min.js"></script>
    <link rel="stylesheet"
          href="<%=contextPath%>/admin/assets/css/bootstrap-timepicker.css" />
    <link rel="stylesheet"
          href="<%=contextPath%>/admin/css/uploadify.css" />
    <script src="<%=contextPath%>/admin/js/jquery.uploadify.min.js"></script>


    <script type="text/javascript">
    
	$.ajax({
		url : contextPath + '/city',
		type : "POST",
		dataType : 'json',
		async: false,
		data : {
			action : 'list',
			order:' by sort asc'
		},
		success : function(rs, textStatus, jqXHR) {
			if (rs.success) {
				var data = rs.data;
				var options = "";
				for(var i = 0 ; i < data.length ; i++){
					options += '<option value="'+data[i].id+ '">' + data[i].cityName + '</option>';
				}
				$("#cityId").append(options);
			} else {
				showMessage("获取数据失败,请稍后再试");
			}
			$("#loading").hide();

		},
		error : function() {
			$("#loading").hide();
			showMessage("请稍后再试");
		}
		});
	
        $("#cimage").uploadify({
            'auto'           : true,
            'swf'            : '<%=contextPath%>/admin/css/uploadify.swf',
            'uploader'       : '<%=contextPath%>/upload?action=image',
            'queueID'        : 'tip',//与下面的id对应
            'queueSizeLimit' :12,
            'fileTypeDesc'   : '图片文件',
            'fileTypeExts'   : '*.jpg;*.png', //控制可上传文件的扩展名，启用本项时需同时声明fileDesc
            'multi'          : true,
            'buttonText'     : '上传' ,
            onUploadSuccess : function(file, data,
                                       response) {
                if (response) {
                    var json = eval("(" + data+ ")");
                    var imgsrc = json.data;
                    $("#classImage").val(imgsrc);
                    $("#imageClass").show();
                    $("#imageClass").find("img").attr("src",contextPath + imgsrc);
                }
            }
        });
        $("#dimage").uploadify({
            'auto'           : true,
            'swf'            : '<%=contextPath%>/admin/css/uploadify.swf',
            'uploader'       : '<%=contextPath%>/upload?action=image',
            'queueID'        : 'tip',//与下面的id对应
            'queueSizeLimit' :12,
            'fileTypeDesc'   : '图片文件',
            'fileTypeExts'   : '*.jpg;*.png', //控制可上传文件的扩展名，启用本项时需同时声明fileDesc
            'multi'          : true,
            'buttonText'     : '上传' ,
            onUploadSuccess : function(file, data,
                                       response) {
                if (response) {
                    var json = eval("(" + data+ ")");
                    var imgsrc = json.data;
                    $("#detailImage").val(imgsrc);
                    $("#imagedetail").show();
                    $("#imagedetail").find("img").attr("src",contextPath + imgsrc);
                }
            }
        });
	$("#caimage").uploadify({
		'auto'           : true,
		'swf'            : '<%=contextPath%>/admin/css/uploadify.swf',
		'uploader'       : '<%=contextPath%>/upload?action=image',
		'queueID'        : 'tip',//与下面的id对应
		'queueSizeLimit' :12,
		'fileTypeDesc'   : '图片文件',
		'fileTypeExts'   : '*.jpg;*.png', //控制可上传文件的扩展名，启用本项时需同时声明fileDesc
		'multi'          : true,
		'buttonText'     : '上传' ,
		onUploadSuccess : function(file, data,
								   response) {
			if (response) {
				var json = eval("(" + data+ ")");
				var imgsrc = json.data;
				$("#categoryImage").val(imgsrc);
				$("#imageCategory").show();
				$("#imageCategory").find("img").attr("src",contextPath + imgsrc);
			}
		}
	});

//		$('input[name=date-range-picker]').daterangepicker().prev().on(ace.click_event, function(){
//			$(this).next().focus();
//		});
		$('#id-date-range-picker-1').timepicker({
            minuteStep: 1,
            showSeconds: true,
            showMeridian: false,
            disableFocus: true
        });

		$(function(){
				init();
		});
		function init() {
			setTimeout(getData(1), 1000);
		}

		function getData(start) {
			$("#loading").show();
				$.ajax({
					url : contextPath + '/shop',
					type : "POST",
					dataType : 'json',
					data : {
						action : 'ProdcutClassList',
						cityId : $('#cityId').val(),
						begin : (start - 1) * pageSize,
						end : pageSize,
					},
					success : function(rs, textStatus, jqXHR) {
						if (rs.success) {
							var data = rs.data;
							var total = 17;/*rs.total;*/
							var dataList = $("#data-list");
							dataList.empty();
							$("#total").text(total);
							$("#current").text((start - 1) * pageSize + 1);
							if (data.length > 0) {
								$("#page").text(
										(start - 1) * pageSize + data.length);
								parseData(data, total, start);
							} else {
								showMessage("无数据");
							}
						} else {
							showMessage("获取数据失败,请稍后再试");
						}
						$("#loading").hide();

					},
					error : function() {
						$("#loading").hide();
						showMessage("请稍后再试");
					}
			});
		}

		function parseData(data, total, start) {
			var dataList = $("#data-list");
			var tr = "";
			for (var i = 0; i < data.length; i++) {
				tr += '<tr>';
				tr += '<td>'+$("#cityId option[value=" +data[i].cityId+ "]").text()+'</td>';
				tr += '<td>'+data[i].className+'</td>';
				tr += '<td>'+data[i].classOrder+'</td>';
                tr += '<td>'+data[i].closetime+'</td>';
                tr += '<td><img src="'+data[i].classImage+'" width="100%" height="200px"/></td>';
				tr += '<td><img src="'+data[i].detailImage+'" width="100%" height="200px"/></td>';
				tr += '<td><img src="'+data[i].categoryImage+'" width="100%" height="200px"/></td>';
				if(data[i].type == 0){
					tr += '<td>普通</td>';
				}else if(data[i].type==1){
					tr += '<td>逼格</td>';
				}
				else if(data[i].type==2){
					tr += '<td>一元购</td>';
				}
				else if(data[i].type==3){
					tr += '<td>地推专场</td>';
				}
                if(data[i].isopen == 1){
                    tr += '<td><span class="label label-success">开通</span></td>';
                    tr += '<td><input type="hidden" value="'+data[i].id+'" class="adId"/><button type="button" class="btn btn-primary btn-xs edit" onclick="edit(\''+data[i].id+'\')">编辑</button>&nbsp;&nbsp;<button type="button" class="btn btn-primary btn-xs del">删除</button>&nbsp;&nbsp;<button type="button" class="btn btn-primary btn-xs open">关闭</button></td>';
                }else{
                    tr += '<td><span class="label label-warning">未开通</span></td>';
                    tr += '<td><input type="hidden" value="'+data[i].id+'" class="adId"/><button type="button" class="btn btn-primary btn-xs edit" onclick="edit(\''+data[i].id+'\')">编辑</button>&nbsp;&nbsp;<button type="button" class="btn btn-primary btn-xs del">删除</button>&nbsp;&nbsp;<button type="button" class="btn btn-primary btn-xs open">打开</button></td>';
                }


			}
			dataList.append(tr);


			$(".open").bind("click", function() {
				var id = $(this).parent().find("input.adId").val();
				$("#loading").show();
				$.ajax({
					url : contextPath + '/shop',
					type : "POST",
					dataType : 'json',
					data : {
						action : 'changePcOpenState',
						id:id
					},
					success : function(rs, textStatus, jqXHR) {
						if (rs.success) {
							showMessage(rs.msg);
							setTimeout(function(){
								getData(1);
							},1000);
						} else{
							showMessage(rs.msg);
						}
						$("#loading").hide();
					},
					error : function() {
						$("#loading").hide();
						showMessage("请稍后再试");
					}
				});
			});
			$(".del").bind("click", function() {
				var id = $(this).parent().find("input.adId").val();
				$("#loading").show();
				$.ajax({
					url : contextPath + '/shop',
					type : "POST",
					dataType : 'json',
					data : {
						action : 'delProdcutClass',
						id:id
					},
					success : function(rs, textStatus, jqXHR) {
						if (rs.success) {
							showMessage(rs.msg);
							setTimeout(function(){
								getData(1);
							},1000);
						} else{
							showMessage(rs.msg);
						}
						$("#loading").hide();
					},
					error : function() {
						$("#loading").hide();
						showMessage("请稍后再试");
					}
				});
			});
			//分页
			var pageList = $("#page-list");
			pageList.empty();
			pageList.append(getPageInfo(start, total));
			$("html,body").animate({scrollTop:0},200);	
		}

		
		$("#addAd").bind("click",function(){

			$("#acEditBox").show();
			$("#action").val("addProdcutClass");
			$("#id").val("");
			$("#classname").val("");
			$("#classOrder").val("");

			$("#classImage").val("");
			$("#detailImage").val("");
			$("#categoryImage").val("");
			$("#id-date-range-picker-1").val("");
            $("#imagedetail").find("img").attr("src"," ");
            $("#imageClass").find("img").attr("src"," ");
            $("#imageClass").hide();
            $("#imagedetail").hide();
		});


//        $(".edit").bind("click", function() {
//            $("#acEditBox").show();
//            $("#action").val("addProdcutClass");
//            $("#id").val("");
//            $("#classname").val("");
//            $("#classOrder").val("");
////			$("#closeImage").val("");
//            $("#detailImage").val("");
//            $("#id-date-range-picker-1").val("");
//        });

        function edit(id) {
            $.post("/shop?action=prodcutClassdetail",{id:id},
                    function(data){
                        if (!data.success){
                        }else {
                            $("#acEditBox").show();
                            $("#action").val("updateProdcutClass");
                            $("#id").val(data.data.id);
                            $("#classname").val(data.data.className);
                            $("#classOrder").val(data.data.classOrder);
                            $("#detailImage").val(data.data.detailImage);
                            $("#classImage").val(data.data.classImage);
                            $("#categoryImage").val(data.data.categoryImage);
                            $("#id-date-range-picker-1").val(data.data.closetime);
                            $("#imageClass").find("img").attr("src",data.data.classImage);
                            $("#imagedetail").find("img").attr("src",data.data.detailImage);
                            $("#imageClass").show();
                            $("#imagedetail").show();
                        }
                    },"json");
        }

        $("#cancel").bind("click",function(){
            $("#acEditBox").hide();
            $("#action").val("addProdcutClass");
            $("#id").val("");
            $("#classname").val("");
            $("#classOrder").val("");
            $("#classImage").val("");
            $("#detailImage").val("");
            $("#categoryImage").val("");
            $("#id-date-range-picker-1").val("");
            $("#imageClass").hide();
            $("#imagedetail").hide();
		});
		
		$("#save").bind("click",function(){

			if ($("#id-date-range-picker-1").val() == "") {
				showMessage("请输入送餐时间!!!");
				return;
			}
			var date = $("#id-date-range-picker-1").val();


			$("#loading").show();
			$("#acForm").ajaxSubmit({
				type : "POST",
				url : contextPath + '/shop?action=' + $("#action").val(),
				dataType : 'json',
				success : function(data) {
					if (data.success) {
						showMessage(data.msg);
						$("#acEditBox").hide();
						$("#action").val("add");
						$("#id").val("");
						$("#name").val("");
						$("#startDate").val("");
						$("#id-date-range-picker-1").val("");
						setTimeout(function() {
							getData(1);
						}, 2000);
					} else {
						showMessage(data.msg);
					}
					$("#loading").hide();
				},
				error : function(msg) {
					$("#loading").hide();
					showMessage("操作失败");
				}
			});
		});
	</script>
</body>
</html>